<template>
  <div class="skill">

      <p-form layout="inline">
        <p-form-item label="选择日期">
          <p-range-picker v-model="SeletedDateArr" @change="dateChange" />
        </p-form-item>
      </p-form>

        <!-- training record -->
        <p-table bordered rowKey="id" :columns="columns" :data-source="data">
          <a slot="name" slot-scope="text">{{ text }}</a>
        </p-table>
  </div>
</template>

<script type="text/javascript">
import { postAction, getAction, deleteAction, putAction } from "@/api/manage";

const columns = [
  {
    title: '技能代码',
    dataIndex: 'skillno',
    key: 'skillno',
  },
  {
    title: '技能名称',
    dataIndex: 'skillname',
    key: 'skillname',
    ellipsis: true,
  },
  {
    title: '培训起始时间',
    dataIndex: 'planStartTime',
    key: 'planStartTime',
    ellipsis: true,
  },

  {
    title: '培训结束时间',
    dataIndex: 'planEndTime',
    key: 'planEndTime',
    ellipsis: true,
  },
  {
    title: '是否合格',
    dataIndex: 'address2',
    key: 'address 4',
    ellipsis: true,
  },
  {
    title: '培训老师',
    dataIndex: 'address3',
    key: 'address 4',
    ellipsis: true,
  },
];

export default {
  props: {
    empno: String,
  },

  data() {
    return {
      columns,
      data:[],
      SeletedDateArr: [],
      beginDate: '',
      endDate: '',
      url: {
        list: '/mes-manpower/mesHrMtplanDetail/listByEmpno'
      }      
    }
  },

  watch: {
    empno(){
      Object.assign(this.$data, this.$options.data())
    }
  },

  mounted() {
  },
  methods: {
    getTraningRecordList(){
      const { beginDate, endDate } = this
      const params = {
        empno:this.empno,
        beginDate,
        endDate,
      }
      getAction(this.url.list, params).then( res => {
        console.log(res.data);
        if (res.success) {
          this.data = res.data
        }
      } )
    },
    dateChange(dates, dateStrings){
      console.log(dates);
      console.log(dateStrings);
      console.log(this.SeletedDateArr);
      
      [this.beginDate, this.endDate] = dateStrings
      this.getTraningRecordList()
    }    
  },
  components: {

  }
}
</script>

<style lang="less" scoped>
</style>
